<template>
	<view :style="$s.view_color">
		<my-navbar :name="nav_title"></my-navbar>
		<view class="order-content">
			<view class="order-row">
				<view>取车凭证</view>
				<view class="upload-box">
					<my-u-upload
						:fileList="file_list1"
						@afterRead="afterRead"
						@delete="deletePic"
						multiple
						name="1"
						width="100" 
						height="100"
						:maxCount="20"
						:previewFullImage="true"
					></my-u-upload>
				</view>
				<view>
					<button class="my-but-primary" text="" @click="submit()">确定提交</button>
				</view>
			</view>
		</view>		
	</view>
</template>

<script>
	import $file from "@/common/file"
	import checkLogin from '@/mixins/loginCheck.js'
	export default {
		mixins:[checkLogin],
		data() {
			return {
				nav_title:'上传取车凭证',
				file_list1:[],
				post_data:{
					order_id:0,
					images_path:'',
				}
			}
		},
		onLoad(option){
			if(option.id!=null){
				this.post_data.order_id=option.id
			}else{
				this.$c.error('缺少参数','index/index')
			}
		},
		onShow(){
			this.initData()
		},
		methods: {
			initData(){

			},
			//删除图片
			deletePic(event) {
				this[`file_list${event.name}`].splice(event.index, 1)
			},
			//上传图片
			async afterRead(event){
				this[`file_list${event.name}`]= await $file.multipleUpload(event,this[`file_list${event.name}`])
			},
			//提交订单
			submit(){
				let imgs=[]
				this.file_list1.map((item) => {
					imgs.push(item.url)
				})
				this.post_data.images_path=imgs.join(',')
				//上传凭证
				this.$u.api.uploadGain(this.post_data).then(res=>{
					this.$c.success('提交成功！','order/detail/index?id='+this.post_data.order_id,4)
				})
			},
		}
	}
</script>

<style lang="scss">
	page{
		background-color: $u-bg-color;
	}
	.order-content{
		margin: 20rpx;
	}
	.order-row{
		padding: 40rpx;
		position: relative;
		margin-bottom: 20rpx;
		overflow: hidden;
		background-color: #fff;
		border-radius: 20rpx;
	}
	.order-row .upload-box{
		margin: 30rpx auto;
	}
</style>
